<template>
  <div class="chart-container">
       <div id="myradius" style="width:100%;height:300px;text-align:center;"></div>
  </div>
</template>

<script>
let myradius = null
import echarts from "echarts";
export default {
  name: "demoTwo",
  filters: {},
  data() {
    return {
    
    };
  },
  created() {},
  mounted() {
      myradius = echarts.init(document.getElementById("myradius"));
      this.drawLine();
  },
  methods: {
     drawLine(){
         let option = {
            xAxis: {
              type: 'category',
              data: ['Mon', 'Tue', 'Wed', 'Thu', 'Fri', 'Sat', 'Sun']
            },
            yAxis: {
              type: 'value'
            },
            series: [
              {
                data: [150, 230, 224, 218, 135, 147, 260],
                type: 'line'
              }
            ]
          };
          myradius.setOption(option, true);
     }
  }
};
</script>

<style>
.chart-container {
  position: relative;
  width: 100%;
  height: calc(100vh - 84px);
}
</style>
